<div class="file-preview-toolbar">
  <div class="alignleft">
    <button *ngIf="!currentDocument.isBackDisabled" mat-icon-button class="back-button" (click)="closeToolbar()">
      <mat-icon class="back-arrow"> arrow_back</mat-icon>
    </button>
    <span class="file-name">{{currentDocument.name}}</span>
  </div>
  <div class="aligncenter text-light" *ngIf="documentsPreview.otherDocuments?.length>0">
    <button mat-icon-button class="back-button" (click)="onPreviousClick()">
      <mat-icon class="back-arrow"> arrow_back_ios</mat-icon>
    </button>
    <span>{{currentIndex}} &nbsp;&nbsp; of &nbsp;&nbsp; {{documentsPreview.otherDocuments.length}}</span>
    <button mat-icon-button class="back-button" (click)="onNextClick()">
      <mat-icon class="back-arrow"> arrow_forward_ios</mat-icon>
    </button>
  </div>
  <div class="alignright" *ngIf="documentsPreview.otherDocuments?.length>0">
    <button class="mr-1" mat-icon-button color="primary" matTooltip="更多" [matMenuTriggerFor]="documentMenu"
      aria-label="Menu">
      <mat-icon> more_vert</mat-icon>
    </button>
    <mat-menu #documentMenu="matMenu">
      <button *hasClaim="'IsSharedFileFolder'" mat-menu-item (click)="onShared('file')">
        <mat-icon> shared</mat-icon>
        共享
      </button>
      <button *hasClaim="'IsSharedLink'" mat-menu-item (click)="onCreateShareableLink()">
        <mat-icon> link</mat-icon>
        生成可共享链接
      </button>
      <ng-container>
        <button *hasClaim="'IsCopyFile'" mat-menu-item (click)="onCopied()">
          <mat-icon> content_copy</mat-icon>
          拷贝
        </button>
      </ng-container>
      <ng-container>
        <button *hasClaim="'IsMoveFile'" mat-menu-item (click)="onMoved()">
          <mat-icon> zoom_out_map</mat-icon>
          移动
        </button>
      </ng-container>
      <button *hasClaim="'IsDownloadFile'" mat-menu-item (click)="downloadDocument()">
        <mat-icon> download</mat-icon>
        下载
      </button>
      <button *hasClaim="'IsSendEmail'" mat-menu-item (click)="sendEmail()">
        <mat-icon> forward_to_inbox</mat-icon>
        发送邮件
      </button>
      <button *hasClaim="'IsRenameFile'" mat-menu-item (click)="renameDocument()">
        <mat-icon> edit</mat-icon>
        重命名
      </button>
      <button mat-menu-item (click)="onCommentClick()">
        <mat-icon> chat</mat-icon>
        评论
      </button>
      <button *hasClaim="'IsDeleteFileFolder'" mat-menu-item (click)="deleteDocument()">
        <mat-icon> delete</mat-icon>
        删除
      </button>
      <button mat-menu-item (click)="toggleDocumentStarred()">
        <ng-container *ngIf="currentDocument.isStarred">
          <mat-icon class="material-icons"> grade</mat-icon>
          移除关注
        </ng-container>
        <ng-container *ngIf="!currentDocument.isStarred">
          <mat-icon class="material-icons-outlined"> grade</mat-icon>
          添加关注
        </ng-container>
      </button>
      <button mat-menu-item (click)="onVersionHistoryClick()">
        <mat-icon> history</mat-icon>
        版本历史
      </button>
    </mat-menu>
    <button *ngIf="currentDocument.isDownloadEnabled" mat-icon-button class="back-button download-button alignright"
      (click)="downloadDocument()">
      <mat-icon class="back-arrow"> download</mat-icon>
    </button>
  </div>
</div>
